class ParkingLot extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            parkId: this.props.parkId,
            payCustomerIds: []
        }
    }

    componentDidMount() {
        this.verify = {
            parkName: function (value) {
                if (value.length < 2) {
                    return '标题至少得2个字符!';
                }
            },
            commCode: function (value) {
                if (value.length !== 4) {
                    return '必须选择一个小区！';
                }
            },
            monthCardNum: (value) => {
                let r = /^\+?[1-9][0-9]*$/;　　//正整数
                if (!r.test(value)) {
                    return '月卡车位必须是正整数！';
                }
            },
            guestNum: (value) => {
                let r = /^\+?[1-9][0-9]*$/;　　//正整数
                if (!r.test(value)) {
                    return '临时卡车位必须是正整数！';
                }
            }
        };
        postJson("/customer/pay/list.x", null, (data) => {
            console.log("customer", data);
            this.setState({
                payCustomerIds: data.data
            })
        });
    }

    btnSubmit() {
        postJson("/car/parkingLot/saveParkingLot.x", $('#add_parking_lot_form').serialize(), (data) => {
            parent.layer.msg('添加成功', {icon: 6});
            this.refs.parkName.value = '';
            this.refs.description.value = '';
            this.refs.monthCardNum.value = '';
            this.refs.guestNum.value = '';
            this.refs.buildingSelectList.commCode = '';
            this.setState({
                parkId: '',
                parkSpaceNum: '',
                guestRemainNum: '',
                monthCardRemainNum: '',
                lockedParkNumber: '',
                creationTime: ''
            }, () => {
                if (this.props.addSuccess) {
                    this.props.addSuccess();
                }
            })
        });
    }

    editParkingLot(parkId) {
        if (parkId) {
            this.setState({
                parkId: parkId
            }, () => {
                let param = {};
                param.parkId = this.state.parkId;
                postJson("/car/parkingLot/queryParkingLotInfo.x", $.param(param), function (data) {
                    this.refs.parkName.value = data.data.parkName;
                    this.refs.description.value = data.data.description;
                    this.refs.payCustomerId.value = data.data.payCustomerId;
                    this.refs.monthCardNum.value = data.data.monthCardNum;
                    this.refs.guestNum.value = data.data.guestNum;
                    this.refs.buildingSelectList.commCode = data.data.commCode;
                    this.setState({
                        parkSpaceNum: data.data.parkSpaceNum ? data.data.parkSpaceNum : '',
                        guestRemainNum: data.data.guestRemainNum ? data.data.guestRemainNum : '',
                        monthCardRemainNum: data.data.monthCardRemainNum ? data.data.monthCardRemainNum : '',
                        lockedParkNumber: data.data.lockedParkNumber ? data.data.lockedParkNumber : '',
                        creationTime: data.data.creationTime ? data.data.creationTime : '',
                        monthlyRate: data.data.monthlyRate ? data.data.monthlyRate : ''
                    })
                }.bind(this));
            });
        }
    }

    selectCallback(commCode) {
        this.refs.commCode.value = commCode;
    }

    render() {
        return <Form size="sm" id="add_parking_lot_form" type="pane" verify={() => {
            return this.verify;
        }}>
            {this.state.parkId ? <Input name="parkId" type="hidden" value={this.state.parkId}/> : ''}
            {this.state.parkSpaceNum ? <Input name="parkSpaceNum" value={this.state.parkSpaceNum} type="hidden"/> : ''}
            {this.state.guestRemainNum ?
                <Input name="guestRemainNum" type="hidden" value={this.state.guestRemainNum}/> : ''}
            {this.state.monthCardRemainNum ?
                <Input name="monthCardRemainNum" type="hidden" value={this.state.monthCardRemainNum}/>
                : ''}
            {this.state.lockedParkNumber ?
                <Input name="lockedParkNumber" type="hidden" value={this.state.lockedParkNumber}/> : ''}
            {this.state.creationTime ? <Input name="creationTime" type="hidden" value={this.state.creationTime}/> : ''}
            {this.state.monthlyRate ?
                <Input name="monthlyRate" type="hidden" value={this.state.monthlyRate}/> : ''}
            <Input name="commCode" ref="commCode" type="hidden"/>
            <Item>
                <LayuiCommSelect
                    formLabelName="小区选择"
                    mask={['building', 'unit', 'floor', 'room']}
                    ref="buildingSelectList"
                    onChangeComm={(comm) => this.selectCallback(comm)}/>
            </Item>

            <Item>
                <Label>支付客户ID</Label>
                <Select name="payCustomerId" ref="payCustomerId" onChange={(data) => this.assignedChange(data)}>
                    <option value="">支付客户ID</option>
                    {
                        this.state.payCustomerIds.map((payCustomerId) => {
                            return <option value={payCustomerId.id}>{payCustomerId.customName}</option>
                        })
                    }
                </Select>
            </Item>
            <Item>
                <Label>月卡车位</Label>
                <Input type="text" name="monthCardNum" ref="monthCardNum" lay-verify="monthCardNum"
                       placeholder="请输入月卡车位"/>
            </Item>
            <Item>
                <Label>临时车位</Label>
                <Input type="text" name="guestNum" ref="guestNum" lay-verify="guestNum" placeholder="请输临时月卡车位"/>
            </Item>

            <Item>
                <Label>停车场名称</Label>
                <Input type="text" name="parkName" ref="parkName" lay-verify="parkName"
                       placeholder="请输入停车场名称"/>
            </Item>

            <Item>
                <Label>描述</Label>
                <Input type="text" name="description" ref="description" lay-verify="description"
                       placeholder="请输入停车场描述"/>
            </Item>

            <Item>
                <Button btnType="normal" size="sm" formBtn="true" id="savebt" lay-submit="true"
                        onClick={() => this.btnSubmit()}>新增保存</Button>
            </Item>
        </Form>
    }
}